<html>
<head>
<meta charset="UTF-8" />
	<Title>Jewish Calendar Online - Convert Dates</title>
	<meta name="description=" content="The Jewish Calendar Online offers an interactive
									   online calendar with all Jewish dates and holidays in conjunction with the gregorian calendar.">
									   

	<link rel="stylesheet" type="text/css" media="all" href="style.css" />
	<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
	<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
	<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
	<script type="text/javascript" src="hebcal.js"></script>
<script>
$(function() {
	ReadXMLAndSetData();
	$( "#datepicker" ).datepicker({
		showButtonPanel: true,
		altField: "#GregorianDate",
		onSelect: function(dateText, inst) { 
				var gregDate = new Date(dateText);
				var hebDate = GregToHeb(gregDate).split('/');
				$("#JewishDate").val(arrHebMonths[hebDate[0]-1] + " " + arrHebDate[hebDate[1]-1] + ", " + Nyear2Hyear(hebDate[2]));
			},		
//		altFormat: "DD, d MM, yy",
		altFormat: "MM dd, yy",
		changeMonth: true,
		changeYear: true
		});
	});
</script>	

</head>

<body class="home blog home">
  
  <header id="header">
    
        <h1 id="logo">
      <a href="http://jquerymobile.com/" rel="home" title="jQuery Mobile">jQuery Mobile</a>
    </h1>
    
<style>
#logo a { background: url(http://jquerymobile.com/wp-content/uploads/2012/09/jquery-mobile-logo-03.png) no-repeat !important;}
</style>

     <nav id="site-nav">
       <ul>
         <li id="nav-calendar" class="alpha"><a href="calendar.html">Calendar</a></li>
         <li id="nav-convert"><a href="convert dates.html">Convert Dates</a></li>
         <li id="nav-holidays"><a href="holidays.html">Holidays</a></li>
		 <li id="nav-about"><a href="about us.html">About Us</a></li>
         <li id="nav-contact" class="omega"><a href="contact us.html">Contact Us</a></li>
       </ul>
     </nav>
   </header>

   <section id="page">
	<article id="calendar-main">
	<h2>Convert Dates</h2>
	<div class="leftFloating" style="width:15%;">
		<h3>Gregorian to Jewish</h3>
		<p class="seriously-cross-platform">
		Date (Gregorian): <input type="text" id="GregorianDate" size="30"/>
		<div id="datepicker"></div>
		<p class="seriously-cross-platform">
		Date (Jewish): <input type="text" id="JewishDate" size="30"/>
		</p>
	</div>
	<div class="rightFloating" style="width:40%; float:right;">
		<h3>Jewish to Gregorian</h3>
		<div id="HebDateForm">
		<script type="text/javascript">
		function loadForm()
		{
			if (loaded == false)
			{
				setTimeout(loadForm, 500);
				return;
			}
			$("#HebDateForm").html(createForm());	
		}
		function createForm()
		{
			var text="<form id='NewEvent' action='javascript:submitEvent()' Method='GET'"
			text+="<p dir='"+directionOfForm+"'>&nbsp;&nbsp;&nbsp;&nbsp;<span lang='he'>"+ENUM_EventTabText[3]+": <select size='1' id='EventDay'></select> &nbsp;&nbsp;&nbsp; "
			text+=ENUM_EventTabText[4]+":&nbsp;<select size='1' id='EventMonth' onchange='updateDays()'></select> &nbsp;&nbsp;&nbsp; </span></p>"
			text+="<p dir='"+directionOfForm+"'>&nbsp;&nbsp;&nbsp;<span lang='he'> "+ENUM_EventTabText[5]+":&nbsp;"
			text+="<select size='1' id='EventYear' onchange='updateDays()'></select></span>"
			text+="</font></form>"
			return text;
		}
		
		loadForm();
		</script>

		</div>		
		
	</div>
	
	
	</article>

    <footer id="footer">
      <p id="jq-copyright">Copyright 2013 <a href="http://jewishcal.com/">Jewish Calendar</a>.</p> 
    </footer>
  </section>
</body>
</html>